<template>
	<view class="gradens-yhrw-update">
		<view class="gradens-yhrw-view-card">
			<view class="yhrw-view-list-item">
				<view class="yhrw-view-list-name">计划名称:</view>
				<text class="yhrw-view-list-text">{{weekInfo.planName}}</text>
			</view>
			<view class="yhrw-view-list-item">
				<view class="yhrw-view-list-name">计划类型:</view>
				<text class="yhrw-view-list-text">{{weekInfo.type}}</text>
			</view>
			<view class="yhrw-view-list-item">
				<view class="yhrw-view-list-name">起止时间:</view>
				<text class="yhrw-view-list-text">{{weekInfo.startTime | date('yyyy/mm/dd')}} ~ {{weekInfo.endTime | date('yyyy/mm/dd')}}</text>
			</view>
			<view class="yhrw-view-list-item">
				<view class="yhrw-view-list-name">任务状态:</view>
				<text class="yhrw-view-list-text">{{weekInfo.status}}</text>
			</view>
			<view class="yhrw-view-list-item">
				<view class="yhrw-view-list-name">日期:</view>
				<text class="yhrw-view-list-text">{{diaryInfo.maintainTime | date('yyyy年mm月dd日')}} </text>
			</view>
			<view class="yhrw-view-list-item">
				<uni-calendar :lunar="true" class="uni-calendar--hook" :selected="info.selected" :showMonth="false"
					@change="change" @monthSwitch="monthSwitch" />
			</view>
			<view style="margin-top: 20rpx;">
				<uni-forms ref="form" :label-width="75" :modelValue="formData" :rules="rules">
					<uni-forms-item label="填报内容" name="maintainContent">
						<uni-easyinput type="textear" v-model="formData.maintainContent" placeholder="请输入填报内容" />
					</uni-forms-item>
					<uni-forms-item label="填报进度" name="schedule">
						<uni-easyinput class="input" v-model="formData.schedule" type="number"
							placeholder="请输入填报进度"></uni-easyinput>
					</uni-forms-item>
				</uni-forms>
			</view>
			<view class="" style="display: flex;margin-top: 40rpx;">
				<button type="primary" style="width: 200rpx;" @click="goImage">上传图片</button>
				<button type="primary" style="width: 200rpx;" @click="submit">提交</button>
			</view>
		</view>
	</view>
</template>

<script>
	/**
	 * 获取任意时间
	 */
	function getDate(date, AddDayCount = 0) {
		if (!date) {
			date = new Date()
		}
		if (typeof date !== 'object') {
			date = date.replace(/-/g, '/')
		}
		const dd = new Date(date)

		dd.setDate(dd.getDate() + AddDayCount) // 获取AddDayCount天后的日期

		const y = dd.getFullYear()
		const m = dd.getMonth() + 1 < 10 ? '0' + (dd.getMonth() + 1) : dd.getMonth() + 1 // 获取当前月份的日期，不足10补0
		const d = dd.getDate() < 10 ? '0' + dd.getDate() : dd.getDate() // 获取当前几号，不足10补0
		return {
			fullDate: y + '-' + m + '-' + d,
			year: y,
			month: m,
			date: d,
			day: dd.getDay()
		}
	}
	import {
		listMaintainDiary,
		updateMaintainDiary
	} from '@/api/comp/maintainDiary'
	import {
		listQueryWeekList
	} from '@/api/comp/maintainWeekPlan'
	import {
		baseUrl
	} from "@/config.js";
	import {
		getToken
	} from '@/utils/auth'
	import {
		mapState
	} from "vuex";
	export default {
		data() {
			return {
				date: new Date(),
				// showCalendar: false,
				info: {
					lunar: true,
					range: true,
					insert: false,
					selected: []
				},
				formData: {
					tb_nr: '',
					jidu: '',
					image: ''
				},
				rules: {
					maintainContent: {
						rules: [{
							required: true,
							errorMessage: '不能为空',
						}]
					},
					// 对name字段进行必填验证
					schedule: {
						rules: [{
							required: true,
							errorMessage: '不能为空',
						}, ]
					},
					// 对email字段进行必填验证
					email: {
						rules: [{
							format: 'email',
							errorMessage: '请输入正确的邮箱地址',
						}]
					}
				},
				weekInfo: {},
				diaryInfo: {},
				maintainDiaryList: []
			}
		},
		computed: {
			...mapState({
				name: (state) => state.user.name,
				userInfo: (state) => state.user.userInfo,
		
			}),
		},
		onReady() {
			// this.$nextTick(() => {
			// 	this.showCalendar = true
			// })
			// TODO 模拟请求异步同步数据
		},
		onLoad(options) {
			this.getList(options)
		},
		methods: {
			getList(options) {
				let id = options.id;
				listQueryWeekList().then(res => {
					this.weekInfo = res.rows.find(item => item.id === id)
					let startTime = new Date(this.weekInfo.startTime)
					let endTime = new Date(this.weekInfo.endTime)
					if (this.date.getTime() < startTime.getTime()) {
						this.$set(this.weekInfo, 'status', '未开始')
					} else if (this.date.getTime() > startTime.getTime() && this.date.getTime() < endTime
						.getTime() && this.weekInfo.schedule !== '100') {
						this.$set(this.weekInfo, 'status', '养护中')
					} else if (this.date.getTime() > endTime.getTime() && this.weekInfo.schedule !== '100') {
						this.$set(this.weekInfo, 'status', '已结束')
					} else if (this.weekInfo.schedule == '100') {
						this.$set(this.weekInfo, 'status', '已完成')
					}
					listMaintainDiary({
						weekId: id
					}).then(res => {
						res.rows.map(item => {
							if (this.parseTime(new Date, "{y}-{m}-{d}") === this
								.parseTime(item.maintainTime, "{y}-{m}-{d}")) {
								this.diaryInfo = item
							}
						})
						this.maintainDiaryList = res.rows
					})
				})
			},
			open() {
				this.$refs.calendar.open()
			},
			close() {
				console.log('弹窗关闭');
			},
			goImage() {
				if (this.diaryInfo.status === '1') {
					this.$u.toast('该日期已填报')
					return
				} else {
					uni.navigateTo({
						url: '/pages/gardens/yhrw/image?id=' + this.diaryInfo.id
					})
				}
			},
			backClick() {
				uni.navigateBack()
			},
			uploadfn(tempFilePaths) {
				return new Promise((resolve, reject) => {
					uni.uploadFile({
						url: baseUrl + '/am/amAttach/uploadAndSaveTheFile', //仅为示例，非真实的接口地址
						filePath: tempFilePaths,
						name: 'file',
						header: {
							Authorization: 'Bearer ' + getToken()
						},
						formData: {
							mainId: this.diaryInfo.id,
							bussType: 'td_comp_maintain_week_plan'
						},
						success: (uploadFileRes) => {
							console.log(uploadFileRes.data);
							resolve(uploadFileRes.data)
						},

						fail: function(err) {
							reject(err)
						}
					});
				})
			},
			submit() {
				this.$refs.form.validate().then(res => {
					if (this.diaryInfo.status === '1') {
						this.$u.toast('该日期已填报')
						return
					}
					res.id = this.diaryInfo.id
					res.status = "1";
					res.rptTime = new Date().getTime();
					res.userName = this.name
					let imglist = this.$store.state.yhrw.imglist
					let arr = imglist.map(file => {
						return this.uploadfn(file)
					})
					Promise.all(arr).then(_ => {
						updateMaintainDiary(res).then(_ => {
							this.$u.toast('提交成功')
							setTimeout(() => {
								uni.navigateBack()
							}, 2000)
						}).catch(_ => {
							this.$u.toast('提交失败')
						})
					})



				}).catch(err => {
					// console.log('表单错误信息：', err);
					// this.$u.toast('查询条件为空，查询错误')
				})
			},
			change(e) {
				this.maintainDiaryList.map(item => {
					if (this.parseTime(item.maintainTime, "{y}-{m}-{d}") === e.fulldate) {
						this.diaryInfo = item
					}
				})
				console.log('change 返回:', e)
			},
			confirm(e) {
				console.log('confirm 返回:', e)
			},
			monthSwitch(e) {
				console.log('monthSwitchs 返回:', e)
			}
		}
	}
</script>

<style lang="scss">
	$nav-height: 30px;

	.box-bg {
		background-color: #F5F5F5;
		padding: 5px 0;
	}

	.city {
		/* #ifndef APP-PLUS-NVUE */
		display: flex;
		/* #endif */
		flex-direction: row;
		align-items: center;
		justify-content: flex-start;
		// width: 160rpx;
		margin-left: 4px;
	}

	.input-uni-icon {
		line-height: $nav-height;
	}

	.gradens-yhrw-view-card {
		box-sizing: border-box;
		padding: 10rpx 10px;
	}

	.gradens-yhrw-update {
		.yhrw-view-list-item {
			display: flex;
			padding-top: 20rpx;
			align-items: center;

			.yhrw-view-list-name {
				width: 125rpx;
			}

			.yhrw-view-list-text {
				flex: 1;
			}
		}
	}
</style>